/**
 * @file tea
 * @date 2024/7/28
 * @author Yi Tao
 * @description Description
 */

// Your code here
let pageTeaArr = [];//所有分页
let page;//总页数
let nowPage = 0;//当前页数
let perPageNum = 10;//每页数量
let teaArr = [];//所有茶
let searchPageTeaArr = [];//搜索结果;
window.onload = function () {
    getTeaArr();
    document.getElementById("first").onclick = () => {
        nowPage = 0;
        showTea(pageTeaArr[0]);
        setPreAndNext();
    }
    document.getElementById("previous").onclick = () => {
        nowPage = nowPage - 1;
        showTea(pageTeaArr[nowPage]);
        setPreAndNext();
    }
    document.getElementById("next").onclick = () => {
        nowPage = nowPage + 1;
        showTea(pageTeaArr[nowPage]);
        setPreAndNext();
    }
    document.getElementById("last").onclick = () => {
        nowPage = page - 1;
        showTea(pageTeaArr[page]);
        setPreAndNext();
    }
    // 获取地址栏信息
    let search = location.href;
    // 从后面向前截取
    let lis = document.getElementsByTagName('li');
    for (let i = 0; i < 6; i++) {
        let info = lis[i].getElementsByTagName("a")[0].href;
        if (search == info) {
            lis[i].getElementsByTagName("a")[0].className = "active";
        } else {
            lis[i].getElementsByTagName("a")[0].className = "";
        }
    }
}

/**
 * 获取所有茶
 */
function getTeaArr() {
    $.ajax({
        url: "/tea/getTeaArr",
        type: "get",
        dataType: "json",
        success: function (info) {
            if (info.code == 1) {
                teaArr = info.data;
                processingPageData(teaArr);
                pageTeaArr = searchPageTeaArr;
                showTea(searchPageTeaArr[0]);
                showPageBtn();
            } else {
                alert(info.msg);
            }
        }
    })
}

/**
 * 分页显示
 * @param Arr
 */
function showTea(Arr) {
    let teaContainer = document.querySelector(".tea-container");
    teaContainer.innerHTML = "";
    for (let i = 0; i < Arr.length; i++) {
        let tea = Arr[i];
        // let delay = i * 0.2; // 每个项目延迟 0.2 秒
        teaContainer.innerHTML += `<div class="tea-item">
                <div>
                    <img src="../../img/yitao/tea/${tea.imgSrc}" alt="${tea.name}">
                    <p>${tea.name}</p>
                    <span class="lineBetween"><hr></span>
                    <span>￥${tea.price}.0</span>
                    <button>→</button>
                </div>
            </div>`;
    }
}

/**
 * 分页按钮
 */
function showPageBtn() {
    let pageBtnList = document.getElementById("pageBtnList");
    pageBtnList.innerHTML = "";
    let pageLi = document.createElement("li");
    for (let i = 0; i < page; i++) {
        pageLi.innerHTML += `
            <button class="${nowPage == i ? 'selectedBtn' : ''}" name='pageBtn'">${i + 1}</button>
        `;
        pageBtnList.appendChild(pageLi);
    }
    setPreAndNext();
    let pageBtn = document.getElementsByName('pageBtn');
    for (let i = 0; i < pageBtn.length; i++) {
        pageBtn[i].onclick = function () {
            for (let i = 0; i < pageBtn.length; i++) {
                pageBtn[i].classList.remove("selectedBtn")
            }
            this.classList.add("selectedBtn");
            nowPage = i;
            setPreAndNext();
            showTea(searchPageTeaArr[i]);
        }
    }

}

//前后按钮设置
function setPreAndNext() {
    if (page == 1) {
        document.getElementById("first").style.opacity = "0";
        document.getElementById("previous").style.opacity = "0";
        document.getElementById("next").style.opacity = "0";
        document.getElementById("last").style.opacity = "0";
    } else if (nowPage == 0) {
        document.getElementById("first").style.opacity = "0";
        document.getElementById("previous").style.opacity = "0";
        document.getElementById("next").style.opacity = "1";
        document.getElementById("last").style.opacity = "1";
    } else if (nowPage == page - 1) {
        document.getElementById("first").style.opacity = "1";
        document.getElementById("previous").style.opacity = "1";
        document.getElementById("next").style.opacity = "0";
        document.getElementById("last").style.opacity = "0";
    } else {
        document.getElementById("first").style.opacity = "1";
        document.getElementById("previous").style.opacity = "1";
        document.getElementById("next").style.opacity = "1";
        document.getElementById("last").style.opacity = "1";
    }
}

function changeType(type) {
    if (type == "全部") {
        searchPageTeaArr = pageTeaArr;
        processingPageData(teaArr);
        showTea(searchPageTeaArr[nowPage]);
        showPageBtn();
        return;
    }
    searchTeaArr = [];
    for (let i = 0; i < teaArr.length; i++) {
        if (teaArr[i].teaType == type) {
            searchTeaArr.push(teaArr[i]);
        }
    }
    if (searchTeaArr.length == 0) {
        alert("无该类型茶");
        return;
    }
    processingPageData(searchTeaArr);
    showTea(searchPageTeaArr[nowPage]);
    showPageBtn();
}

/**
 * 进行分页处理
 * @param teaArr
 */
function processingPageData(teaArr) {
    searchPageTeaArr = [];
    page = teaArr.length / perPageNum;
    page = page % 1 > 0 ? Math.floor(page + 1) : Math.floor(page);//向上取整
    // debugger;
    for (let i = 0; i < page; i++) {
        let pageTea = [];
        for (let j = 0; j < perPageNum; j++) {
            if (i * perPageNum + j < teaArr.length) {
                // pageTeaArr[i].push(teaArr[i * perPageNum + j]);
                pageTea.push(teaArr[i * perPageNum + j]);
            } else {
                break;
            }
        }
        searchPageTeaArr.push(pageTea);
    }
    nowPage = 0;
}